import Vue from 'vue'
import Vuex from 'Vuex'
//Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式,就是总管这个项目运行的
//将vuex引入到当前这个项目中
Vue.use(Vuex)
//将vuex暴露出来使数据可以在其他页面拿到
let store = new Vuex.Store({
  state: {
    carPanelData: [],
    receiveInfo: [{
      "name": "王某某",
      "phone": "13811111111",
      "areaCode": "010",
      "landLine": "64627856",
      "provinceId": 110000,
      "province": "北京市",
      "cityId": 110100,
      "city": "市辖区",
      "countyId": 110106,
      "county": "海淀区",
      "add": "上地十街辉煌国际西6号楼319室",
      "default": true
    },{
      "name": "李某某",
      "phone": "13811111111",
      "areaCode": "010",
      "landLine": "64627856",
      "provinceId": 110000,
      "province": "北京市",
      "cityId": 110100,
      "city": "市辖区",
      "countyId": 110106,
      "county": "海淀区",
      "add": "上地十街辉煌国际东6号楼350室",
      "default": false
    }],
    maxOff: false,
    carShow: false,
    carTimer: null,
    ball: {
      show: false,
      el: null,
      img:''
    },
    orderData: []
  },
  //判断商品总数是否为0
  getters: {
    totleCount (state) {
      let count = 0
      //循环购物车里的数组
      state.carPanelData.forEach((goods) => {
        count += goods.count
      })
      return count
    },
    totlePrice (state) {
      //让价钱等于0
      let price = 0
      state.carPanelData.forEach((goods) => {
        price += goods.price * goods.count
      })
      return price
    },
    allChecked (state) {
      let allChecked = true
      state.carPanelData.forEach((goods) => {
        if (!goods.checked) {
          allChecked = false
          return
        }
      })
      return allChecked
    },
    checkedCount (state) {
      let count = 0
      state.carPanelData.forEach((goods) => {
        if (goods.checked) { 
          count += goods.count
        }
      })
      return count
    },
    checkedPrice(state) {
      let price = 0
      state.carPanelData.forEach((goods) => {
        if (goods.checked) { 
          price += goods.count*goods.price
        }
      })
      return price
    },
    checkedGoods (state) {
      let checkedGoods = []
      state.carPanelData.forEach((goods) => {
        if (goods.checked) { 
          checkedGoods.push(goods)
        }
      })
      return checkedGoods
    }
  },
  //这里是在注册一个事件，当触发对应事件的时候调用此组件
  mutations: {
  	addCarPanelData (state,data) {
     //这是一个开关判断他是否继续执行
      let bOff = true
      //判断小球是否显示
      if (!state.ball.show) {
        //让小球每一个滑动完了再加
        state.carPanelData.forEach((goods) => {
          //如果goods.sku_id 全等于 data.info.sku_id那么就执行
          if (goods.sku_id === data.info.sku_id) {
            goods.count += data.count
            bOff = false
            //判断弹窗是否显示
            if (goods.count > goods.limit_num) {
              goods.count -= data.count
              state.maxOff = true
              return
            }
            state.carShow = true
            state.ball.show = true
            state.ball.img = data.info.ali_image
            state.ball.el = event.path[0]
          }
        })
        //注意一定要有空格
        if (bOff) {
          let goodsData = data.info
          Vue.set(goodsData,'count',data.count)
          Vue.set(goodsData,'checked',true)
          state.carPanelData.push(goodsData)
          state.carShow = true
          state.ball.show = true
          state.ball.img = data.info.ali_image
          state.ball.el = event.path[0]
        }
      }
      },
      //删除购物车的方法，输入对应id删除商品
    delCarPanelData (state,id) {
      state.carPanelData.forEach((goods,index) => {
        if (goods.sku_id === id) {
          state.carPanelData.splice(index,1)
          return 
        }
      })
    },
    //购物车增加数量
    plusCarpanelData(state,id) {
       state.carPanelData.forEach((goods,index) => {
        if (goods.sku_id === id) {
         if (goods.count > goods.limit_num) return
         goods.count++
          return
        }
      })
    },
    subCarpanelData(state,id) {
      state.carPanelData.forEach((goods,index) => {
       if (goods.sku_id === id) {
        if (goods.count <= 1) return
        goods.count--
         return
       }
     })
   },
   checkGoods (state,id) {
    state.carPanelData.forEach((goods,index) => {
      if (goods.sku_id === id) {
        goods.checked = !goods.checked
        return
      }
    })
   },
   allCheckGoods (state,allChecked) {
    state.carPanelData.forEach((goods,index) => {
        goods.checked = !allChecked
    })
   },
   delCkeckGoods (state) {
     let i = state.carPanelData.length
     while (i) {
         if(state.carPanelData[i],checked){
          state.carPanelData.splice(i,1)
         }
     }
     
   },
    closePrompt (state) {
      state.maxOff = false
    },
    //清空购物车，并隐藏
    showCar (state) {
      clearTimeout(state.carTimer)
      state.carShow = true
    },
    hideCar (state) {
    state.carTimer =  setTimeout(() => {
      state.carShow = false
     }, 500)
    },
    submitReceive (state,data) {
      if (data.default) {
        state.receiveInfo.forEach((receive) => {
          receive.default = false
        })
      }
      state.receiveInfo.push(data)
    },
    submitOrderHandle (state,data) {
      state.orderData.unshift(data)
      let i = state.carPanelData.length
      while (i--) {
        if (state.carPanelData.checked) {
          state.carPanelData.splice(i , 1)
        }
      }
    }
  }
})

export default store
